<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="../asserts/plugins/bootstrap/css/bootstrap.css" rel="stylesheet">
    <script src="../asserts/plugins/jquery-3.6.0.min.js"></script>
    <script src="../asserts/plugins/bootstrap/js/bootstrap.js"></script>
    <script>
        $(function () {
            // 获取个人信息
            $.ajax({
                url:"/KunKunMarket/UserController?type=getMyData",
                type:"get",
                dataType:"json",
                success:function (respBean) {
                    if (respBean.status == 500){
                        alert(respBean.msg);
                        return;
                    }
                    console.log(respBean.data);
                    $("#user_id").text(respBean.data.id);
                    //$("#user_id").text(respBean.data.id);
                    $("#money").text(respBean.data.money);
                    $("#sex").text(respBean.data.sex);
                    $("#phone").text(respBean.data.phone);
                    $("#username").text(respBean.data.username);
                    let user_type = respBean.data.user_type=='0'? '普通用户':'商家';
                    $("#user_type").text(user_type);
                }
            })

            //修改个人信息
            $("button[name=updateMyData]").click(function () {
                let username = $("#tanChuang_1").find("input[name=username]").val();
                let user_type = $("#tanChuang_1").find("input[name=user_type]").val();
                let sex = $("#tanChuang_1").find("input[name=sex]").val();
                let phone = $("#tanChuang_1").find("input[name=phone]").val();
                $.ajax({
                    url: "/KunKunMarket/UserController",
                    type: "get",
                    dataType: 'json',
                    data:{
                        type:'updateMyData',
                        username: username,
                        user_type: user_type,
                        sex:  sex,
                        phone: phone
                    },
                    success: function (respBean) {
                        alert(respBean.msg);
                        $("button[data-dismiss=modal]").click();
                    }
                })
            })
            //充值
            $("button[name=addMoney]").click(function () {
                let password = $("#tanChuang_2").find("input[name=password]").val();
                let money = $("#tanChuang_2").find("input[name=money]").val();
                $.ajax({
                    url: "/KunKunMarket/UserController",
                    type: "get",
                    dataType: 'json',
                    data:{
                        type:'addMoney',
                        password: password,
                        money: money
                    },
                    success: function (respBean) {
                        alert(respBean.msg);
                        $("button[data-dismiss=modal]").click();
                    }
                })
            })
            //修改密码
            $("button[name=updatePassword]").click(function () {
                let oldPassword = $("#tanChuang_3").find("input[name=oldPassword]").val();
                let newPassword = $("#tanChuang_3").find("input[name=newPassword]").val();
                $.ajax({
                    url: "/KunKunMarket/UserController",
                    type: "get",
                    dataType: 'json',
                    data:{
                        type:'updatePassword',
                        oldPassword: oldPassword,
                        newPassword: newPassword
                    },
                    success: function (respBean) {
                        alert(respBean.msg);
                        $("button[data-dismiss=modal]").click();
                    }
                })
            })

        })
    </script>
</head>
<body>

    <div class="container" id="myData">
        <a href="/KunKunMarket/UserController?type=logout">退出登录</a>
        <!-- 头部导航栏 -->
        <nav class="navbar navbar-default">
            <div class="container-fluid">
                <!-- Brand and toggle get grouped for better mobile display -->
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="#">个人信息</a>
                </div>

                <!-- Collect the nav links, forms, and other content for toggling -->
                <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                    <ul class="nav navbar-nav">
                        <li class="active"><a href="#">Link <span class="sr-only">(current)</span></a></li>
                        <li class="dropdown">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">选择操作 <span class="caret"></span></a>
                            <ul class="dropdown-menu">
                                <li><a data-target="#tanChuang_1" data-toggle="modal" class="btn btn-success" href="#">修改资料</a></li>
                                <li><a data-target="#tanChuang_2" data-toggle="modal" class="btn btn-primary" href="#">充值</a></li>
                                <li><a data-target="#tanChuang_3" data-toggle="modal" class="btn btn-danger" href="#">修改密码</a></li>
                            </ul>
                        </li>
                    </ul>
                </div>
            </div>
        </nav>

        <div class="container-fluid">
            <ul class="list-group" >
                <li class="list-group-item" style="padding: 15px;font-size: 20px">
                    <span style="display: inline-block;width: 100px">账号id：</span>
                    <span id="user_id" ></span>
                </li>
                <li class="list-group-item" style="padding: 15px;font-size: 20px">
                    <span style="display: inline-block;width: 100px">用户名：</span>
                    <span id="username"></span>
                </li>
                <li class="list-group-item" style="padding: 15px;font-size: 20px">
                    <span style="display: inline-block;width: 100px">密 &nbsp;&nbsp;码：</span>
                    <span id="password">******</span>
                </li>
                <li class="list-group-item" style="padding: 15px;font-size: 20px">
                    <span style="display: inline-block;width: 100px">类 &nbsp;&nbsp;型：</span>
                    <span id="user_type"></span>
                </li>
                <li class="list-group-item" style="padding: 15px;font-size: 20px">
                    <span style="display: inline-block;width: 100px">余 &nbsp;&nbsp;额：</span>
                    <span id="money"></span>
                </li>
                <li class="list-group-item" style="padding: 15px;font-size: 20px">
                    <span style="display: inline-block;width: 100px">性 &nbsp;&nbsp;别：</span>
                    <span id="sex"></span>
                </li>
                <li class="list-group-item" style="padding: 15px;font-size: 20px">
                    <span style="display: inline-block;width: 100px">电 &nbsp;&nbsp;话：</span>
                    <span id="phone"></span>
                </li>
            </ul>
        </div>
    </div>


    <!--fade 弹出表单-->
    <div class="modal fade"  id="tanChuang_1" aria-labelledby="myModallabel" aria-hidden="true" tabindex="-1">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button class="close" type="button" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h5 class="modal-title" id="myModallabel">修改个人信息</h5>
                </div>
                <form id="formData" class="form-horizontal">
                    <input type="hidden" name="commodity_id">
                    <div class="modal-body">
                        <div class="form-group">
                            <label class="control-label col-lg-2">用户名</label>
                            <div class="col-lg-9">
                                <input type="text" value="" name="username" class="form-control"></br>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-lg-2">电话</label>
                            <div class="col-lg-9">
                                <input type="text" value="" name="phone" class="form-control"></br>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-lg-2">性别</label>
                            <div class="col-lg-9">
                                <input type="text" value="" name="sex" placeholder="男 / 女" class="form-control"></br>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-lg-2">用户类型</label>
                            <div class="col-lg-9">
                                <input type="number" placeholder="0普通用户，1商家" name="user_type" class="form-control"></br>
                            </div>
                        </div>

                    </div>
                    <div class="modal-footer">
                        <button class="cel btn btn-default" type="button" data-dismiss="modal">取消</button>
                        <button class="btn btn-success" type="button" name="updateMyData">确认修改</button>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <!--fade 弹出表单，充值-->
    <div class="modal fade"  id="tanChuang_2" aria-labelledby="myModallabel" aria-hidden="true" tabindex="-1">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button class="close" type="button" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h5 class="modal-title">充值</h5>
                </div>
                <form class="form-horizontal">
                    <input type="hidden" name="commodity_id">
                    <div class="modal-body">
                        <div class="form-group">
                            <label class="control-label col-lg-2">数额：</label>
                            <div class="col-lg-9">
                                <input type="text" value="" name="money" class="form-control">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-lg-2">密码：</label>
                            <div class="col-lg-9">
                                <input type="password" value="" name="password" class="form-control">
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button class="cel btn btn-default" type="button" data-dismiss="modal">取消</button>
                        <button class="btn btn-success" type="button" name="addMoney">确认充值</button>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <!--fade 弹出表单，修改密码-->
    <div class="modal fade"  id="tanChuang_3" aria-labelledby="myModallabel" aria-hidden="true" tabindex="-1">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button class="close" type="button" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h5 class="modal-title" >修改密码</h5>
                </div>
                <form  class="form-horizontal">
                    <input type="hidden" name="commodity_id">
                    <div class="modal-body">
                        <div class="form-group">
                            <label class="control-label col-lg-2">旧密码：</label>
                            <div class="col-lg-9">
                                <input type="password" value="" name="oldPassword" class="form-control"></br>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-lg-2">新密码：</label>
                            <div class="col-lg-9">
                                <input type="password" value="" name="newPassword" class="form-control"></br>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button class="cel btn btn-default" type="button" data-dismiss="modal">取消</button>
                        <button class="btn btn-success" type="button" name="updatePassword">确认</button>
                    </div>
                </form>
            </div>
        </div>
    </div>


</body>
</html>